<template>
	<view class="center">
		<view class="box">
			<view>头像</view>
			<image v-if="userInfo.avatar" :src="userInfo.avatar" ></image>
			<image v-else src="@/static/image/avatar.png" ></image>
		</view>
		<view class="box">
			<view>姓名</view>
			<view>{{userInfo.name || '-'}}</view>
		</view>
		<view class="box">
			<view>工号</view>
			<view>{{userInfo.job_number || '-'}}</view>
		</view>
		<view class="box">
			<view>岗位</view>
			<view>{{userInfo.title || '-'}}</view>
		</view>
		<view class="box">
			<view>部门</view>
			<view>{{userInfo.department.split('/')[1] || '-'}}</view>
		</view>
		<view class="box">
			<view>单位</view>
			<view>{{userInfo.department.split('/')[0] || '-'}}</view>
		</view>
		<view class="box">
			<view>电话</view>
			<view>
				{{userInfo.mobile || '-'}}
			</view>
		</view>
	</view>
</template>

<script>
	import {
			mapState
		} from 'vuex';
	export default {
		data() {
			return {
				
			};
		},
		created() {
			console.log(this.userInfo,'userInfo')
		},
		computed: {
					...mapState(['userInfo'])
				},
	}
</script>

<style lang="scss">
	.center{
		padding: 0 52rpx;
	}
	.box{
		display: flex;
		justify-content: space-between;
		align-items: center;
		color: #000623;
		padding: 40rpx 0;
		border-bottom: 2rpx solid #ebeef5;
		image{
			width: 120rpx;
			height: 120rpx;
		}
		&:nth-last-child(1){
			border-bottom: none;
		}
		view:nth-child(1){
			color: #8890A5;
		}
	}
</style>
